<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('药占比')" />
    <th:block th:include="include :: datetimepicker-css" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <form id="formId">
                    <div class="select-list">
                        <ul>
                            <li>
                                <label>月度：</label>
                                <input type="text" name="month" id="month" onchange="queryTableData()" placeholder="yyyy-MM" autocomplete="off">
                            </li>
                            <li>
                                <a class="btn btn-primary btn-rounded btn-sm" onclick="queryTableData()"><i class="fa fa-search"></i>&nbsp;搜索</a>
                                <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i>&nbsp;重置</a>
                                <a class="btn btn-info btn-rounded btn-sm" onclick="toAddData()"><i class="fa fa-plus"></i>&nbsp;一键生成</a>
                            </li>
                        </ul>
                    </div>
                </form>
            </div>
            <div class="col-sm-12 select-table table-striped">
                <table id="bootstrap-table" class=""></table>
            </div>
        </div>
    </div>
     <div class="modal inmodal fade" id="myModal6" tabindex="-1" role="dialog" aria-hidden="true" >
         <div class="modal-dialog modal-lg">
             <div class="modal-content">
                 <div class="modal-header">
                     <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
                     </button>
                     <h4 class="modal-title">请先选择时间范围</h4>
                 </div>
                 <div class="modal-body">
                     <div class="form-group" style="width: 90%">
                         <label class="col-sm-3 font-noraml is-required;" style="text-align-last: right;vertical-align: center">时间范围：</label>
                         <div class="col-sm-8">
                             <div class="input-daterange input-group">
                                 <input type="text" class="input-sm form-control" id="laydate-startTime" autocomplete="off" placeholder="yyyy-MM-dd"/>
                                 <span class="input-group-addon">到</span>
                                 <input type="text" class="input-sm form-control" id="laydate-endTime" autocomplete="off" placeholder="yyyy-MM-dd"/>
                             </div>
                         </div>
                     </div>
                 </div>
                 <div class="modal-footer">
                     <button type="button" class="btn btn-white" data-dismiss="modal">关闭</button>
                     <button type="button" class="btn btn-primary" onclick="addData()">确定</button>
                 </div>
             </div>
         </div>
     </div>
     <th:block th:include="include :: footer" />
     <th:block th:include="include :: datetimepicker-js" />
     <th:block th:include="include :: bootstrap-table-export-js" />
    <script th:inline="javascript">
        function queryTableData() {
            $("#bootstrap-table").bootstrapTable('refresh');
        };
        function toAddData() {
            $("#myModal6").modal("show");
        }
        function addData() {
            $.ajax({
                url: ctx+"base/md/dim/date/insertDay?startDate="+$("#laydate-startTime").val()+"&endDate="+$("#laydate-endTime").val(),
                cache: false,
                type: 'get',
                success: function (result) {
                    $.modal.closeLoading();
                    if(result.code==0) {
                        $.modal.alertSuccess('已生成');
                        $("#myModal6").modal("hide");
                    } else {
                        $.modal.alertError(result.msg);
                    }
                }
            });
            $.modal.loading("数据加载中");
        }
        $(function() {
            layui.use('laydate', function() {
                var laydate = layui.laydate;
                var startDate = laydate.render({
                    elem: '#laydate-startTime',
                    max: $('#laydate-endTime').val(),
                    theme: 'molv',
                    trigger: 'click',
                    done: function (value, date) {
                        // 结束时间大于开始时间
                        if (value !== '') {
                            endDate.config.min.year = date.year;
                            endDate.config.min.month = date.month - 1;
                            endDate.config.min.date = date.date;
                        } else {
                            endDate.config.min.year = '';
                            endDate.config.min.month = '';
                            endDate.config.min.date = '';
                        }
                    }
                });
                var endDate = laydate.render({
                    elem: '#laydate-endTime',
                    min: $('#laydate-startTime').val(),
                    theme: 'molv',
                    trigger: 'click',
                    done: function (value, date) {
                        // 开始时间小于结束时间
                        if (value !== '') {
                            startDate.config.max.year = date.year;
                            startDate.config.max.month = date.month - 1;
                            startDate.config.max.date = date.date;
                        } else {
                            startDate.config.max.year = '';
                            startDate.config.max.month = '';
                            startDate.config.max.date = '';
                        }
                    }
                });
            });
            $("#month").datetimepicker({
                format: "yyyy-mm",
                startView: 3,
                minView: 3,
                autoclose: true
            });
            $("#month").val("2023-01");
            var options = {
                url: ctx+"base/md/dim/date/queryDayByMonth",
                modalName: "天数据管理",
                columns: [{
                    checkbox: true
                },
                    {
                        field: 'id_day',
                        title: '日期'
                    },
                    {
                        field: 'ww',
                        title: '星期',
                        formatter: function(value, item, index) {
                            if(item.ww==1) {
                                return "周一";
                            } if(item.ww==2) {
                                return "周二";
                            } if(item.ww==3) {
                                return "周三";
                            } if(item.ww==4) {
                                return "周四";
                            } if(item.ww==5) {
                                return "周五";
                            } if(item.ww==6) {
                                return "周六";
                            } if(item.ww==7) {
                                return "周日";
                            }
                        }
                    },
                    {
                        field: 'ww_no',
                        title: '第几周'
                    },
                    {
                        field: 'tmp_mx',
                        title: '最高温'
                    },
                    {
                        field: 'tmp_mi',
                        title: '最低温'
                    },
                    {
                        field: 'eu_cls',
                        title: '类型',
                        formatter: function(value, item, index) {
                            if(item.eu_class==1) {
                                return "休息日";
                            } else if(item.eu_class==2) {
                                return "节假日";
                            } {
                                return "工作日"
                            }
                        }
                    }]
            };
            $.table.init(options);
        });
    </script>
</body>
</html>